<template>
  <div class="news">
    <Header></Header>
    <div class="title">
      <div>{{news.title}}</div>
    </div>
    <div class="author">{{'发布人: ' + news.author}}</div>
    <div class="content">
      <div v-html="news.desc"></div>
    </div>
  </div>
</template>

<script>
//引入组件
import Header from "../components/Header";
export default {
  //注册组件
  components: { Header },
  data() {
    return {
      news: {}
    }
  },
  methods: {

  },
  created() {
    //解构数据
    let { params } = this.$route;
    this.$http
      .get('/api/news/list', { params })
      //监听
      .then(({ data }) => {
        this.news = data.data[params.id - 1];
      })
  }
}
</script>

<style lang="scss">
  
  .news {
    padding: 0px 10px;
    .title {
      font-size: 26px;
      font-weight: 400;
    }
    .content {
      width: 100%;
      padding: 20px 0px;
      border-bottom: 1px solid #000;
      margin-bottom: 50px;
      p {
        img {
        width: 100%;
        height: auto;
      }
      }
    }
  }
</style>